import React, { Component } from 'react';
import { connect } from 'react-redux'
import { TopPicWrapper, TopPicItem } from '../style'

class TopPic extends Component {
    render() {
        let { topPicList } = this.props
        return (
            <TopPicWrapper>
                {
                    topPicList.map(itme => {
                        return (
                            <TopPicItem key={itme.get('id')}>
                                <img src={itme.get('imgUrl')} className='item_img' />
                                <div className="title">{itme.get('title')}</div>
                            </TopPicItem>
                        )
                    })
                }
            </TopPicWrapper>
        );
    }

   
}



const mapState = (state) => {
    return {
        topPicList: state.getIn(['home', 'topPicList'])
    }
}

export default connect(mapState, null)(TopPic);